<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>首页 - 智游客户关系管理系统</title>
    <!--    <link rel="stylesheet" href=hahh.css">-->
    <!--    <link rel="stylesheet" href="${pageContext.request.contextPath}/lib/font-awesome/css/font-awesome.css">-->
</head>
<style>  * {
    font-family: 微软雅黑;
}

html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0;
    min-width: 970px;
    min-height: 700px;
    display: flex;
    flex-direction: column;
}

.header {
    height: 50px;
    line-height: 50px;
    background-color: #3c8dbc;
    padding: 0 5px 0 15px;
    color: white;
    display: flex;
    justify-content: space-between;
}

.header h1 {
    margin: 0;
}

.header h1 a {
    display: block;
    color: #eee;
    text-decoration: none;
    font-size: 18px;
    padding: 0;
}

.header .nav a, .header .user a {
    display: block;
    float: left;
    color: #eee;
    text-decoration: none;
    font-size: 13px;
    padding: 0 10px;
}

.header .nav a:hover, .header .user a:hover {
    color: #fff;
    background-color: #444199
}

.header .nav {
    flex-grow: 1;
    padding: 0 30px;
}

.main {
    flex-grow: 1;
    display: flex;
}

.left-side {
    width: 220px;
    background-color: #222d32;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
}

li {
    padding-left: 15px;
    line-height: 44px;
    color: #b8c7ce;
    background-color: #2c3b41;
}

li a {
    display: block;
    color: #abb;
    text-decoration: none;
}

li a:hover {
    color: #fff;
}

.sub-menu {
    display: none;
}

.menu-title.active + li {
    display: block;
}

.menu-title {
    color: #fff;
    border-left: 3px solid transparent;
    background-color: #222d32;
}

.menu-title.active {
    border-left: 3px solid #f39c12;
    background-color: #111;
}

.menu-title.active a {
    color: white;
}

li.active a {
    color: white;
}

.right-side {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

iframe {
    flex-grow: 1px;
    height: 100%;
    width: 100%;
    border: none;
}

.footer {
    width: 100%;
    height: 50px;
    line-height: 50px;
    border-top: 1px solid #d2d6de;
    color: #888;
    text-align: center;
    font-size: 13px;
}</style>
<body>
<div class="header">
    <h1><a href="admin.jsp">智游客户关系管理系统</a></h1>
    <div class="nav">
        <a target="" href="#">工作台</a>
        <a target="" href="#">报表</a>
        <a target="" href="#">客户信息</a>
        <a target="" href="#">员工信息</a>
        <a target="" href="#">公告信息</a>
        <a target="" href="#">发件箱</a>
    </div>
    <div class="user">
        <a href="#">${USER_LOGIN.name}</a>
        <a href="${pageContext.request.contextPath}/user/logout">退出</a>
    </div>
</div>
<div class="main">
    <ul class="left-side">
        <li class="menu-title">
            <a href="#">
                <i class=" fa fa-users"></i>&nbsp;&nbsp;客户管理
            </a>
        </li>
        <li class="sub-menu">
            <ul>
                <li>
                    <a href="#">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;客户信息
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;客户分配
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;客户关怀
                    </a>
                </li>
                <li>
                    <a target="" href="#">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;客户分类
                    </a>
                </li>
                <li>
                    <a target="" href="#">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;客户状态
                    </a>
                </li>
                <li>
                    <a target="" href="#">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;客户来源
                    </a>
                </li>
            </ul>
        </li>
        <li class="menu-title active">
            <a href="#">
                <i class=" fa fa-file-text"></i>&nbsp;&nbsp;内部信息
            </a>
        </li>
        <li class="sub-menu">
            <ul>
                <li>
                    <a target="pageBox" href="http://www.baidu.com">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;通知公告
                    </a>
                </li>
                <li>
                    <a target="" href="#">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;员工信息
                    </a>
                </li>
                <li>
                    <a target="" href="#">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;部门信息
                    </a>
                </li>
            </ul>
        </li>
        <li class="menu-title">
            <a href="#">
                <i class=" fa fa-envelope"></i>&nbsp;&nbsp;站内邮件
            </a>
        </li>
        <li class="sub-menu">
            <ul>
                <li>
                    <a target="pageBox" href="写邮件.html">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;写邮件
                    </a>
                </li>
                <li>
                    <a target="pageBox" href="收件箱.html">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;收件箱
                    </a>
                </li>
                <li>
                    <a target="pageBox" href="发件箱.html">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;发件箱
                    </a>
                </li>
                <li>
                    <a target="pageBox" href="草稿箱.html">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;草稿箱
                    </a>
                </li>
                <li>
                    <a target="pageBox" href="垃圾箱.html">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;垃圾箱
                    </a>
                </li>
            </ul>
        </li>
        <li class="menu-title">
            <a href="#">
                <i class=" fa fa-sitemap"></i>&nbsp;&nbsp;管理员
            </a>
        </li>
        <li class="sub-menu">
            <ul class="menu">
                <li>
                    <a target="pageBox" href="${pageContext.request.contextPath}/notice/list">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;公告管理
                    </a>
                </li>
                <li>
                    <a target="pageBox" href="${pageContext.request.contextPath}/dep/list">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;部门管理
                    </a>
                </li>
                <li>
                    <a target="pageBox" href="${pageContext.request.contextPath}/role/list">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;角色管理
                    </a>
                </li>
                <li>
                    <a target="pageBox" href="${pageContext.request.contextPath}/user/list">
                        <i class=" fa fa-circle-thin"></i>&nbsp;&nbsp;用户管理
                    </a>
                </li>
            </ul>
        </li>
    </ul>
    <div class="right-side">
        <iframe name="pageBox" src="index.html"></iframe>
        <div class="footer">
            河南智游 ©2017 河南智游科技有限公司
        </div>
    </div>
</div>
<script src="${pageContext.request.contextPath}/lib/jquery/jquery.js"></script>
<script src="${pageContext.request.contextPath}/js/admin.js"></script>
</body>
</html>